<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
	<head>
    <meta charset="utf-8">
    <meta name="applicable-device" content="pc">
    <title>我的音乐 - QQ音乐-千万正版音乐海量无损曲库新歌热歌天天畅听的高品质音乐平台！</title>
    <link rel="canonical" href="//y.qq.com/portal/profile.html">
<script>
</script>
    <link rel="stylesheet" href="//y.gtimg.cn/mediastyle/yqq/layout_0412.css?max_age=25920000&amp;v=20190312">
    <link rel="stylesheet" href="//y.gtimg.cn/mediastyle/yqq/profile_61ea2fe1.css?max_age=2592000">
	<link rel="stylesheet" href="assets/css/reset.css">
	<link rel="stylesheet" href="assets/css/common.css">
	<link rel="stylesheet" href="assets/css/slider.css">
	<link rel="stylesheet" href="assets/css/font-awesome.min.css">
	<script src="assets/js/jquery.min.js"></script>
	<script src="assets/js/HBSlider.js"></script>
	<script src="js/bootstrap.min.js"></script>
	<link rel="stylesheet" href="css/auth.css">
	<script src="js/auth.js"></script>
	<script src="js/jquery-3.5.1.js">
	</script>
	
	<style>
		.main {
	    width: 100%;
	    float: left;
	    margin-left: 120px;
	    min-height: 0px; 
	    box-sizing: border-box;
		}
		.js_box{
		 margin-left: 120px;
		 width:1100px;.
		 
		}
		
		.mod_songlist_toolbar{
			text-align: left;
			padding-top: 30px;
		}
		
		.mod_user_statistic {
		    height: 50px;
		    font-size: 14px;
		}
		 .pictureSize{
			width:45px;
			height:45px;
			order: 1px solid white;
			border-radius: 30px;
			margin-top:5px;
		 }
		 
		 .mod_page_nav {
		    font-size: 14px;
		}
		
		h3{
		   	color: black; 
		}
		
	</style>
	</head>
	<body class="os_mac">
		
<!-- 头部 S -->
<div class="mod_header">
        <header>
			<div class="container">
				<div class="navbar-header">
					<a href="" class="navbar-brand">
						<img src="assets/images/logo.png" alt="">
					</a>
				</div>
				<nav>
					<ul class="nav navbar-nav navbar-link" style="display: block;">
						<li>
							<a href="index.html">首页</a>
						</li>
						<li class="active">
							<a href="#">我的音乐</a>
						</li>
						<li>
							<a href="#">歌手</a>
						</li>
						<li>
							<a href="#">排行榜</a>
						</li>
						<li>
							<a href="#">会员中心</a>
						</li>
						<li>
							<a href="#">歌曲广场</a>
						</li>
					</ul>
					<ul class="nav navbar-nav navbar-right navbar-sm" style="display: block;">
						<li><input type="text" class="search-input" placeholder="歌名 / 歌手"></li>
						<li>
							<a href="#"><i class="fa fa-search" aria-hidden="true"></i></a>
						</li>
						<li id="loginItem">
							<a href="register_login.jsp">注册 / 登录</a>
						</li>
					</ul>
				</nav>
			</div>
		</header>
    </div>
    <!-- 头部 E -->
    <div class="mod_profile js_user_data" style="">
	<div class="section_inner">
		<div class="profile__cover_link">
			<img src="#" class="profile__cover" id="profileHead">
		</div>
            <h1 class="profile__tit">
                <span class="profile__name">停停走走。</span><a href="#" target="_blank">
                <img src="#" class="lv_icon"></a>
            </h1>
            <ul class="mod_user_statistic">
                <li class="user_statistic__item">
                    <a href="javascript:;" class="js_tab">
                    <strong class="user_statistic__number js_num_follow">0</strong>
                    <span class="user_statistic__tit">关注</span></a>
                </li>
                <li class="user_statistic__item user_statistic__item--last">
                    <a href="javascript:;" class="js_tab" data-tab="fans">
                    <strong class="user_statistic__number js_num_fans">0</strong>
                    <span class="user_statistic__tit">粉丝</span></a>
                </li>
            </ul>
	    
        </div>
    </div>

    <div class="main main--profile" style="">
        <div class="mod_tab profile_nav" role="nav" id="nav">
            <a class="mod_tab__item mod_tab__current" href="javascript:;" id="like_tab">我喜欢</a>
            <a class="mod_tab__item" href="javascript:;" id="focus_tab">关注</a>
            <a class="mod_tab__item" href="javascript:;" id="fans_tab">粉丝</a>
            <input type="hidden" id="chooseTag" value="喜欢">
        </div>
	</div>
<div class="js_box" id="like_box" style="display: block;">
			<div class="profile_cont">
				<div class="js_sub" id="like_song_box" style="display: block;">
<div class="mod_songlist_toolbar">
	<a href="javascript:;" class="mod_btn_green js_all_play"><i class="mod_btn_green__icon_play"></i>播放全部</a>
</div>
<div class="mod_songlist">
	<ul class="songlist__header">
	    <li class="songlist__edit songlist__edit--check sprite">
		<input type="checkbox" class="songlist__checkbox js_check_all">
	    </li>
		<li class="songlist__header_name">歌曲</li>
		<li class="songlist__header_author">歌手</li>
		<li class="songlist__header_time">时长</li>
	</ul>
	<ul class="songlist__list">
	<li>
		<div class="songlist__item">
		    <div class="songlist__edit songlist__edit--check sprite">
			<input type="checkbox" class="songlist__checkbox">
		    </div>
		    <input type="hidden" class="songId">
		    <div class="songlist__songname">
			<span class="songlist__songname_txt">
			<a href="#" class="js_song">城里的月光
			<span class="songlist__song_txt"></span>
			</a>
			</span>
			<div class="mod_list_menu">
			    <a href="javascript:;" class="list_menu__item list_menu__play js_play playSong">
				<i class="list_menu__icon_play"></i>
				<span class="icon_txt">播放</span>
			    </a>
			</div>
		    </div>
		    <div class="songlist__artist" title="许美静">
			<a href="#"class="singer_name">许美静</a>
		    </div>
		    <input type="hidden" class="singerId">
		    <div class="songlist__time">05:21</div>
		    <div class="songlist__other">
		    </div>
                <a href="javascript:;" class="songlist__delete js_delfav_song"><span class="icon_txt">删除</span></a>
		</div>
		</li>
	</ul>
	<div class="mod_page_nav js_pager_comment pageList">
    	
    </div>
</div>
</div>
</div>
</div>
<div class="js_box" id="focus_box" style="display: none;">
			<div class="mod_tab" role="nav">
				<a class="mod_tab__item mod_tab__current singerItem" href="javascript:;">歌手</a>
				<a class="mod_tab__item accountItem" href="javascript:;">用户</a>
			</div>
		<div class="profile_cont">
			<div class="js_sub" id="focus_singer_box" style="display: block;">
            <div class="mod_singer_list mod_singer_list--fans">
                <ul class="singer_list__list">
                    <li class="singer_list__item">
                        <div class="singer_list__item_box">
                            <a href="#" class="singer_list__cover js_singer">
                                <img class="singer_list__pic" src="#">
                            </a>
                            <h3 class="singer_list__title">
                            <a href="#" class="js_singer">刘德华</a></h3>
                            <div class="singer_list__focus">
                            <a href="javascript:;" class="mod_btn singer_list__btn_focus js_follow_singer">
							<span class="btn_focus__cont"><i class="mod_btn__icon_yes"></i>已关注</span>
                                </a>
                            </div>
                        </div>
                    </li>
				</ul>
				<div class="mod_page_nav js_pager_comment pageList">
			   
			    </div>
	   		</div>
	   </div>
		<div class="js_sub" style="display: none;" id="focus_user_box">
            <div class="mod_singer_list mod_singer_list--fans">
                <ul class="singer_list__list attentionAccountList">
                    <li class="singer_list__item">
                        <div class="singer_list__item_box">
                            <a href="#" class="singer_list__cover js_profile">
                                <img class="singer_list__pic " src="#" >
                            </a>
                            <h3 class="singer_list__title">
                            <a href="#" class="js_profile">Autism°</a></h3>
                            <div class="singer_list__focus">
                                <a href="javascript:;" class="mod_btn singer_list__btn_focus js_follow_user">
									<i class="mod_btn__icon_yes" id="attentionTag"></i>
									<span class="btn_focus__cont">已关注</span>
                                </a>
                            </div>
                        </div>
                    </li>
				</ul>
					<div class="mod_page_nav js_pager_comment pageList">
				    
				    </div>
	   		</div>
	   </div>
	</div>
</div>
<div class="js_box profile_cont" id="fans_box" style="display: none;">
            <div class="mod_singer_list mod_singer_list--fans">
                <ul class="singer_list__list fansList">
                    <li class="singer_list__item">
                        <div class="singer_list__item_box">
                            <a href="#" class="singer_list__cover js_profile" >
                                <img class="singer_list__pic " src="//thirdqq.qlogo.cn/g?b=sdk&amp;k=XCkmdHM0pxhHJJ9H3K6sww&amp;s=140&amp;t=1581390326" alt="飞世彭">
                            </a>
                            <h3 class="singer_list__title"><a href="#" class="js_profile">飞世彭</a></h3>
                            <div class="singer_list__focus">
                                <a href="javascript:;" class="mod_btn singer_list__btn_focus js_follow_user">
									<i class="mod_btn__icon_new"></i>关注
                                </a>
                            </div>
                        </div>
                    </li>
			</ul>
				<div class="mod_page_nav js_pager_comment pageList">
			   
			    </div>
	 	  </div>
	  </div>
	  
	<script type="text/javascript">
		/* var loginAccount = "${sessionScope.loginAccount}"; */
		var loginAccount = {
			accountId : "10",
			accountTel : "17519485014",
			accountPwd : "123456",
			accountPicture : null,
			vipStatus : "0"
		};
		var accountId = "10";
		var vipStatus = 1;
		/*var accountPicture = "${sessionScope.loginAccount.vipStatus}"; */	
/* 		var accountPicture = "${sessionScope.loginAccount.accountPicture}"; */	
		var accountPicture = "";
		$(document).ready(function(){
			if (loginAccount != "") {
				 $("#loginItem").empty(); 
				 $("#loginItem").append("<img id=\"faceImg\" class=\"pictureSize\" src=\"${pageContext.request.contextPath}/front/img/adminpicture.jpg\"/>");
				if (accountPicture=="") {
					 $("#profileHead").prop("src","${pageContext.request.contextPath}/front/img/adminpicture.jpg");
				}else {
					 $("#profileHead").prop("src","${pageContext.request.contextPath}/FileDownloadServlet?fileName=images/${sessionScope.loginAccount.accountPicture}");
				}
				
				//名字渲染
				$(".profile__name").text(loginAccount.accountTel);
				
				//发送ajax去后台请求关注和收藏等数据
				$.ajax({
					async:true,
					url:"${pageContext.request.contextPath}/FansServlet",
					type:"post",
					data:{op:"getAttentionAndFansCount",accountId:accountId},
					dataType:"json",
					success:function(result,status,xhr){
							$(".js_num_follow").text(result.attentionCount);
							$(".js_num_fans").text(result.fansCount);
							if (vipStatus==0) {
								$(".lv_icon").prop("src","${pageContext.request.contextPath}/FileDownloadServlet?fileName=images/vipno.png")
							} else if(vipStatus==1) {
								$(".lv_icon").prop("src","${pageContext.request.contextPath}/FileDownloadServlet?fileName=images/vipyes.png")
							}
						},
						error:function(xhr,status,error){
							alert("ajax异步请求失败");
						}
					});
					//渲染我喜欢歌曲列表
					getCollectionSong(1);
				
			}else {
				//未登录跳转到登录页面
				location.href = "${pageContext.request.contextPath}/front/register_login.jsp";
			}
		})
		
		//对我喜欢的歌曲做渲染
		function getCollectionSong(pageNum) {
			$.ajax({
				async:true,
				url:"${pageContext.request.contextPath}/CollectServlet",
				type:"post",
				data:{op:"getMyCollectionSong",accountId:accountId,pageNum:pageNum,pageSize:5},
				dataType:"json",
				success:function(result,status,xhr){
						$("#chooseTag").val("我喜欢");
						$(".singer_list__list").empty();
						$(".fansList").empty();
						$(".songlist__list").empty();
						$(".pageList").empty();
						//收藏歌曲为空时候
						if (result.data =="") {
							$(".pageList").append("<a href=\"javascript:;\" class=\"js_pageindex current pageButton\">1</a>");
							//总页数和下一页追加
							$(".pageList").append("第<span id=\"pagesTotal\" >1</span>页&nbsp&nbsp"+
												" 共<span id=\"pagesDetail\" >1</span>页");
						} else {
							for (var i = 0; i < result.data.length; i++) {
								$(".songlist__list").append("<li><div class=\"songlist__item\">"+
									    " <div class=\"songlist__edit songlist__edit--check sprite\">"+
									    " <input type=\"checkbox\" class=\"songlist__checkbox\"></div>"+
									    " <input type=\"hidden\" class=\"songId\" value="+result.data[i].song.songId+"><div class=\"songlist__songname\">"+
									    " <span class=\"songlist__songname_txt\"><a href=\"#\" class=\"js_song\">"+result.data[i].song.songName+
									    " <span class=\"songlist__song_txt\"></span></a></span><div class=\"mod_list_menu\">"+
									    " <a href=\"javascript:;\" class=\"list_menu__item list_menu__play js_play playSong\">"+
									    " <i class=\"list_menu__icon_play\"></i><span class=\"icon_txt\">播放</span></a>"+
									    " </div></div><div class=\"songlist__artist\">"+
									    " <a href=\"#\"class=\"singer_name\">"+result.data[i].song.singer.singerName+"</a></div>"+
									    " <input type=\"hidden\" class=\"singerId\" value = "+result.data[i].song.singer.singerId+">"+
									    " <div class=\"songlist__time\">"+result.data[i].song.songTime+"</div><div class=\"songlist__other\"></div>"+
									    " <a href=\"javascript:;\" class=\"songlist__delete js_delfav_song\">"+
									    " <span class=\"icon_txt\">删除</span></a></div></li>")
							}
							//分页追加
							addPageInfo(result);
							
						}
					},
					error:function(xhr,status,error){
						alert("ajax异步请求失败");
					}
				});
		}
		
		//对我关注的页面做渲染
		function getAttentionSinger(pageNum) {
			$.ajax({
				async:true,
				url:"${pageContext.request.contextPath}/AttentionServlet",
				type:"post",
				data:{op:"getAttentionSinger",accountId:accountId,pageNum:pageNum,pageSize:5},
				dataType:"json",
				success:function(result,status,xhr){
						$(".pageList").empty();
						$(".singer_list__list").empty();
						$(".fansList").empty();
						$(".songlist__list").empty();
						//关注为空时候
						if (result.data =="") {
							$(".pageList").append("<a href=\"javascript:;\" class=\"js_pageindex current pageButton\">1</a>");
							//总页数和下一页追加
							$(".pageList").append("第<span id=\"pagesTotal\" >1</span>页&nbsp&nbsp"+
												" 共<span id=\"pagesDetail\" >1</span>页");
						} else {
							for (var i = 0; i < result.data.length; i++) {
								$(".singer_list__list").append("<li class=\"singer_list__item\">"+
										" <div class=\"singer_list__item_box\"><a href=\"#\" class=\"singer_list__cover js_singer singerPicture\">"+
										" <img class=\"singer_list__pic\" src=\"${pageContext.request.contextPath}/FileDownloadServlet?fileName=images/"+result.data[i].singer.singerPicture+"\"></a><h3 class=\"singer_list__title\">"+
										" <a href=\"#\" class=\"js_singer singerName\">"+result.data[i].singer.singerName+"</a></h3>"+
			                            " <input type=\"hidden\" class=\"singerId\" value ="+result.data[i].singer.singerId+">"+
			                            " <div class=\"singer_list__focus\">"+
			                            " <a href=\"javascript:;\" class=\"mod_btn singer_list__btn_focus js_follow_singer attentionSinger\">"+
			                            " <i class=\"mod_btn__icon_yes\" id=\"attentionTag\"></i><span class=\"btn_focus__cont attentionContent\">关注</span>"+
			                            " </a></div></div></li>")
							}
							//分页追加
							addPageInfo(result);
						}
					},
					error:function(xhr,status,error){
						alert("ajax异步请求失败");
					}
				});
			
		}
		
		//对我关注的用户做渲染
		function getAttentionAccount(pageNum) {
			$.ajax({
				async:true,
				url:"${pageContext.request.contextPath}/FansServlet",
				type:"post",
				data:{op:"getAttentionAccount",fansId:accountId,pageNum:pageNum,pageSize:5},
				dataType:"json",
				success:function(result,status,xhr){
						$(".pageList").empty();
						$(".singer_list__list").empty();
						$(".fansList").empty();
						$(".songlist__list").empty();
						//关注用户为空时候
						if (result.data =="") {
							$(".pageList").append("<a href=\"javascript:;\" class=\"js_pageindex current pageButton\">1</a>");
							//总页数和下一页追加
							$(".pageList").append("第<span id=\"pagesTotal\" >1</span>页&nbsp&nbsp"+
												" 共<span id=\"pagesDetail\" >1</span>页");
						} else {
							for (var i = 0; i < result.data.length; i++) {
								if (result.data[i].account.accountPicture==null) {
									$(".attentionAccountList").append("<li class=\"singer_list__item\">"+
											" <div class=\"singer_list__item_box\"><a href=\"#\" class=\"singer_list__cover js_singer accountPicture\">"+
											" <img class=\"singer_list__pic\" src=\"${pageContext.request.contextPath}/front/img/adminpicture.jpg\"></a><h3 class=\"singer_list__title\">"+
											" <a href=\"#\" class=\"js_singer accountTel\">"+result.data[i].account.accountTel+"</a></h3>"+
				                            " <input type=\"hidden\" class=\"accountId\" value ="+result.data[i].account.accountId+">"+
				                            " <div class=\"singer_list__focus\">"+
				                            " <a href=\"javascript:;\" class=\"mod_btn singer_list__btn_focus js_follow_singer attentionAccount\">"+
				                            " <i class=\"mod_btn__icon_yes\" id=\"accountTag\"></i><span class=\"btn_focus__cont accountContent\">关注</span>"+
				                            " </a></div></div></li>")
								} else {
									$(".attentionAccountList").append("<li class=\"singer_list__item\">"+
											" <div class=\"singer_list__item_box\"><a href=\"#\" class=\"singer_list__cover js_singer accountPicture\">"+
											" <img class=\"singer_list__pic\" src=\"${pageContext.request.contextPath}/FileDownloadServlet?fileName=images/"+result.data[i].account.accountPicture+"\"></a><h3 class=\"singer_list__title\">"+
											" <a href=\"#\" class=\"js_singer accountTel\">"+result.data[i].account.accountTel+"</a></h3>"+
				                            " <input type=\"hidden\" class=\"accountId\" value ="+result.data[i].account.accountId+">"+
				                            " <div class=\"singer_list__focus\">"+
				                            " <a href=\"javascript:;\" class=\"mod_btn singer_list__btn_focus js_follow_singer attentionAccount\">"+
				                            " <i class=\"mod_btn__icon_yes\" id=\"accountTag\"></i><span class=\"btn_focus__cont accountContent\">关注</span>"+
				                            " </a></div></div></li>")
								}
							}
							//分页追加
							addPageInfo(result);
						}
					},
					error:function(xhr,status,error){
						alert("ajax异步请求失败");
					}
				});
		}
		
		//对我的粉丝做渲染
		function getFansByAccountId(pageNum) {
			$.ajax({
				async:true,
				url:"${pageContext.request.contextPath}/FansServlet",
				type:"post",
				data:{op:"getFans",accountId:accountId,pageNum:pageNum,pageSize:5},
				dataType:"json",
				success:function(result,status,xhr){
						$(".pageList").empty();
						$(".singer_list__list").empty();
						$(".fansList").empty();
						$(".songlist__list").empty();
						//粉丝为空时候
						if (result.data =="") {
							$(".pageList").append("<a href=\"javascript:;\" class=\"js_pageindex current pageButton\">1</a>");
							//总页数和下一页追加
							$(".pageList").append("第<span id=\"pagesTotal\" >1</span>页&nbsp&nbsp"+
												" 共<span id=\"pagesDetail\" >1</span>页");
						} else {
							for (var i = 0; i < result.data.length; i++) {
								if (result.data[i].account.accountPicture==null) {
									$(".fansList").append("<li class=\"singer_list__item\">"+
											" <div class=\"singer_list__item_box\"><a href=\"#\" class=\"singer_list__cover js_singer fansPicture\">"+
											" <img class=\"singer_list__pic\" src=\"${pageContext.request.contextPath}/front/img/adminpicture.jpg\"></a><h3 class=\"singer_list__title\">"+
											" <a href=\"#\" class=\"js_singer fansTel\">"+result.data[i].account.accountTel+"</a></h3>"+
				                            " <input type=\"hidden\" class=\"fansId\" value ="+result.data[i].account.accountId+">"+
				                            " <div class=\"singer_list__focus\">"+
				                            " <a href=\"javascript:;\" class=\"mod_btn singer_list__btn_focus js_follow_singer myFans\">"+
				                            " <i class=\"mod_btn__icon_yes\" id=\"fansTag\"></i><span class=\"btn_focus__cont fansContent\">关注</span>"+
				                            " </a></div></div></li>")
								} else {
									$(".fansList").append("<li class=\"singer_list__item\">"+
											" <div class=\"singer_list__item_box\"><a href=\"#\" class=\"singer_list__cover js_singer fansPicture\">"+
											" <img class=\"singer_list__pic\" src=\"${pageContext.request.contextPath}/FileDownloadServlet?fileName=images/"+result.data[i].account.accountPicture+"\"></a><h3 class=\"singer_list__title\">"+
											" <a href=\"#\" class=\"js_singer fansTel\">"+result.data[i].account.accountTel+"</a></h3>"+
				                            " <input type=\"hidden\" class=\"fansId\" value ="+result.data[i].account.accountId+">"+
				                            " <div class=\"singer_list__focus\">"+
				                            " <a href=\"javascript:;\" class=\"mod_btn singer_list__btn_focus js_follow_singer myFans\">"+
				                            " <i class=\"mod_btn__icon_yes\" id=\"fansTag\"></i><span class=\"btn_focus__cont fansContent\">关注</span>"+
				                            " </a></div></div></li>")
								}
							}
							//分页追加
							addPageInfo(result);
						}
					},
					error:function(xhr,status,error){
						alert("ajax异步请求失败");
					}
				});
		}
		
		
		//点击我喜欢进行页面跳转渲染
		$("#like_tab").click(function(){
			$("#focus_user_box").css("display","none");
			$("#focus_box").css("display","none");
			$("#fans_box").css("display","none");
			$("#like_box").css("display","block");
			$("#fans_tab").removeClass("mod_tab__current");
			$("#focus_tab").removeClass("mod_tab__current");
			$("#like_tab").addClass("mod_tab__current");
			getCollectionSong(1);
		})
		
		//点击关注进入页面并做渲染
		$("#focus_tab").click(function(){
			$("#chooseTag").val("歌手");
			$("#focus_user_box").css("display","none");
			$("#like_box").css("display","none");
			$("#fans_box").css("display","none");
			$("#focus_box").css("display","block");
			$("#fans_tab").removeClass("mod_tab__current");
			$(".singerItem").addClass("mod_tab__current");
			$(".accountItem").removeClass("mod_tab__current");
			$("#focus_tab").addClass("mod_tab__current");
			$("#like_tab").removeClass("mod_tab__current");
			getAttentionSinger(1);
		})
		
		//歌手页面-关注按钮事件
		$(document).on("click",".attentionSinger",function(){
			var singerId  =$(this).parent().prev().val();
			var attentionTag = $(this).children("i");
			var attentionContent = $(this).children("span");
			//判断是否已关注
			$.ajax({
				async:true,
				url:"${pageContext.request.contextPath}/AttentionServlet",
				type:"post",
				data:{op:"existAttention",singerId:singerId,accountId:accountId},
				dataType:"text",
				success:function(result,status,xhr){
					if ("noAttention"==result) {
						//做添加关注
						$.ajax({
							async:true,
							url:"${pageContext.request.contextPath}/AttentionServlet",
							type:"post",
							data:{op:"addAttention",singerId:singerId,accountId:accountId},
							dataType:"text",
							success:function(result,status,xhr){
									if ("addYes"==result) {
										attentionTag.removeClass("mod_btn__icon_more");
										attentionTag.addClass("mod_btn__icon_yes");
										attentionContent.text("已关注");
									}
								},
								error:function(xhr,status,error){
									alert("ajax异步请求失败");
								}
							});
					}else if ("yesAttention"==result) {
							//做取消关注
							$.ajax({
								async:true,
								url:"${pageContext.request.contextPath}/AttentionServlet",
								type:"post",
								data:{op:"deleteAttention",singerId:singerId,accountId:accountId},
								dataType:"text",
								success:function(result,status,xhr){
										if ("deleteYes"==result) {
											attentionTag.addClass("mod_btn__icon_more");
											attentionTag.removeClass("mod_btn__icon_yes");
											attentionContent.text("关注");
										}
									},
									error:function(xhr,status,error){
										alert("ajax异步请求失败");
									}
								});
						}
					},
					error:function(xhr,status,error){
						alert("ajax异步请求失败");
					}
				});
		})
		
		//用户页面-关注按钮事件
		$(document).on("click",".attentionAccount",function(){
			var beFansId  =$(this).parent().prev().val();
			var accountTag = $(this).children("i");
			var accountContent = $(this).children("span");
			//判断是否已关注
			$.ajax({
				async:true,
				url:"${pageContext.request.contextPath}/FansServlet",
				type:"post",
				data:{op:"existFans",fansId:accountId,beFansId:beFansId},
				dataType:"text",
				success:function(result,status,xhr){
					if ("noFans"==result) {
						//做加粉
						$.ajax({
							async:true,
							url:"${pageContext.request.contextPath}/FansServlet",
							type:"post",
							data:{op:"addFans",fansId:accountId,beFansId:beFansId},
							dataType:"text",
							success:function(result,status,xhr){
									if ("success"==result) {
										accountTag.removeClass("mod_btn__icon_more");
										accountTag.addClass("mod_btn__icon_yes");
										accountContent.text("已关注");
									}
								},
								error:function(xhr,status,error){
									alert("ajax异步请求失败");
								}
							});
					}else if ("yesFans"==result) {
							//做取消关注
							$.ajax({
								async:true,
								url:"${pageContext.request.contextPath}/FansServlet",
								type:"post",
								data:{op:"deleteFans",fansId:accountId,beFansId:beFansId},
								dataType:"text",
								success:function(result,status,xhr){
										if ("success"==result) {
											accountTag.addClass("mod_btn__icon_more");
											accountTag.removeClass("mod_btn__icon_yes");
											accountContent.text("关注");
										}
									},
									error:function(xhr,status,error){
										alert("ajax异步请求失败");
									}
								});
						}
					},
					error:function(xhr,status,error){
						alert("ajax异步请求失败");
					}
				});
		})
		
		
		
		//点击歌手头像进入歌手详情页面
		$(document).on("click",".singerPicture",function(){
			var singerId = $(this).next().next().val();
			window.open("${pageContext.request.contextPath}/front/singer_personal_page.jsp?singerId="+singerId);
		})
		
		//点击歌手名字进入歌手详情页面
		$(document).on("click",".singerName",function(){
			var singerId = $(this).parent().next().val();
			window.open("${pageContext.request.contextPath}/front/singer_personal_page.jsp?singerId="+singerId);
		})
		
		//点击关注里面的歌手超链接
		$(document).on("click",".singerItem",function(){
			$("#focus_singer_box").css("display","block");
			$("#focus_user_box").css("display","none");
			$(this).addClass("mod_tab__current");
			$(".accountItem").removeClass("mod_tab__current");
			$("#chooseTag").val("歌手");
			getAttentionSinger(1);
		})
		
		//点击关注里面的用户超链接
		$(document).on("click",".accountItem",function(){
			$("#focus_singer_box").css("display","none");
			$("#focus_user_box").css("display","block");
			$(".singerItem").removeClass("mod_tab__current");
			$(this).addClass("mod_tab__current");
			$("#chooseTag").val("用户");
			getAttentionAccount(1);
		})
		
		//点击粉丝进入粉丝页面
		$("#fans_tab").click(function(){
			$("#like_box").css("display","none");
			$("#focus_box").css("display","none");
			$("#fans_box").css("display","block");
			$("#fans_tab").addClass("mod_tab__current");
			$("#focus_tab").removeClass("mod_tab__current");
			$("#like_tab").removeClass("mod_tab__current");
			$("#chooseTag").val("粉丝");
			
			getFansByAccountId(1);
		})
		
		//粉丝页面-对粉丝做关注
		$(document).on("click",".myFans",function(){
			var beFansId  =$(this).parent().prev().val();
			var fansTag = $(this).children("i");
			var fansContent = $(this).children("span");
			//判断是否已关注
			$.ajax({
				async:true,
				url:"${pageContext.request.contextPath}/FansServlet",
				type:"post",
				data:{op:"existFans",fansId:accountId,beFansId:beFansId},
				dataType:"text",
				success:function(result,status,xhr){
					if ("noFans"==result) {
						//做加粉
						$.ajax({
							async:true,
							url:"${pageContext.request.contextPath}/FansServlet",
							type:"post",
							data:{op:"addFans",fansId:accountId,beFansId:beFansId},
							dataType:"text",
							success:function(result,status,xhr){
									if ("success"==result) {
										fansTag.removeClass("mod_btn__icon_more");
										fansTag.addClass("mod_btn__icon_yes");
										fansContent.text("已关注");
									}
								},
								error:function(xhr,status,error){
									alert("ajax异步请求失败");
								}
							});
					}else if ("yesFans"==result) {
						
							//做取消关注
							$.ajax({
								async:true,
								url:"${pageContext.request.contextPath}/FansServlet",
								type:"post",
								data:{op:"deleteFans",fansId:accountId,beFansId:beFansId},
								dataType:"text",
								success:function(result,status,xhr){
										if ("success"==result) {
											fansTag.addClass("mod_btn__icon_more");
											fansTag.removeClass("mod_btn__icon_yes");
											fansContent.text("关注");
										}
									},
									error:function(xhr,status,error){
										alert("ajax异步请求失败");
									}
								});
						}
					},
					error:function(xhr,status,error){
						alert("ajax异步请求失败");
					}
				});
		})
		
		//页码追加
		function addPageInfo(result) {
			//分页追加
			for (var i = 1; i <= result.pages; i++) {
				
				if (i==result.pageNum) {
				
						$(".pageList").append("<a href=\"javascript:;\" class=\"js_pageindex current pageButton\">"+i+"</a>");
					
				}else {
					$(".pageList").append("<a href=\"javascript:;\" class=\"js_pageindex pageButton\">"+i+"</a>");
				}
			}
			//总页数和下一页追加
			$(".pageList").append(" <a href=\"javascript:;\" class=\"next js_pageindex nextPage\"><span>&gt;</span></a>"+
								" 第<span id=\"pagesTotal\" >"+result.pageNum+"</span>页&nbsp&nbsp"+
								" 共<span id=\"pagesDetail\" >"+result.pages+"</span>页");
			
		}
		
		//对页码做点击事件
		$(document).on("click",".pageButton",function(){
			var chooseTag = $("#chooseTag").val();
			var nowPage = $(this).text();
			if ("我喜欢"==chooseTag) {
				getCollectionSong(nowPage);
				$("#pagesTotal").text(nowPage);
			}else if ("歌手"==chooseTag) {
				getAttentionSinger(nowPage);
				$("#pagesTotal").text(nowPage);
			}else if ("用户"==chooseTag) {
				getAttentionAccount(nowPage);
				$("#pagesTotal").text(nowPage);
			}else if ("粉丝"==chooseTag) {
				getFansByAccountId(nowPage);
				$("#pagesTotal").text(nowPage);
			}
		})
		
		//下一页按钮
			$(document).on("click",".nextPage",function(){
				var chooseTag = $("#chooseTag").val();
				var nowPage = $("#pagesTotal").text();
				var maxPage = $("#pagesDetail").text();
				if ("我喜欢"==chooseTag) {
					if (nowPage<maxPage) {
						getCollectionSong(nowPage*1+1);
						$("#pagesTotal").text(nowPage*1+1);
					}
				}else if ("歌手"==chooseTag) {
					if (nowPage<maxPage) {
						getAttentionSinger(nowPage*1+1);
						$("#pagesTotal").text(nowPage*1+1);
					}
					
				}else if ("用户"==chooseTag) {
					if (nowPage<maxPage) {
						getAttentionAccount(nowPage*1+1);
						$("#pagesTotal").text(nowPage*1+1);
					}
				}else if ("粉丝"==chooseTag) {
					if (nowPage<maxPage) {
						getFansByAccountId(nowPage*1+1);
						$("#pagesTotal").text(nowPage*1+1);
					}
				}
		})
		
		//歌曲后面播放按钮
		$(document).on("click",".playSong",function(){
			var songId = $(this).parent().parent().prev().val();
			//判断是否在播放列表中
			$.ajax({
				async:true,
				url:"${pageContext.request.contextPath}/PlayListServlet",
				type:"post",
				data:{op:"existPlayList",songId:songId,accountId:accountId},
				dataType:"text",
				success:function(result,status,xhr){
					//未添加到播放列表
					if ("yesPlay"!=result) {
						$.ajax({
							async:true,
							url:"${pageContext.request.contextPath}/PlayListServlet",
							type:"post",
							data:{op:"addPlayList",songId:result,accountId:accountId},
							dataType:"text",
							success:function(result,status,xhr){
								if ("addyes"==result) {
										alert("添加到播放列表成功")
										window.open("${pageContext.request.contextPath}/front/play.jsp?songId="+songId);
								}else if ("addno"==result) {
										alert("添加到播放列表失败");
									}
								},
								error:function(xhr,status,error){
									alert("ajax异步请求失败");
								}
							});
						}else if ("yesPlay"==result) {
							window.open("${pageContext.request.contextPath}/front/play.jsp");
						}
					},
					error:function(xhr,status,error){
						alert("ajax异步请求失败");
					}
				});
		})
		
		//点击歌名进入歌曲信息页面(我喜欢)
		$(document).on("click",".js_song",function(){
			var songId = $(this).parent().parent().prev().val();
			window.open("${pageContext.request.contextPath}/front/comment.jsp?songId="+songId);
		})
		
		//点击歌手名字进入歌手(我喜欢)
		$(document).on("click",".singer_name",function(){
			var singerId = $(this).parent().next().val();
			window.open("${pageContext.request.contextPath}/front/singer_personal_page.jsp?singerId="+singerId);
		})
		
		//点击垃圾箱从我的收藏列表删除(我喜欢)
		$(document).on("click",".songlist__delete",function(){
			var songId = $(this).parent().children("input[class='songId']").val();
			$.ajax({
				async:true,
				url:"${pageContext.request.contextPath}/CollectServlet",
				type:"post",
				data:{op:"deleteCollect",songId:songId,accountId:accountId},
				dataType:"text",
				success:function(result,status,xhr){
					if ("yes"==result) {
							alert("移除播放列表成功")
							getCollectionSong(1);
					}else if ("no"==result) {
							alert("移除播放列表失败");
						}
					},
					error:function(xhr,status,error){
						alert("ajax异步请求失败");
					}
				});
		})
		
		//播放全部按钮
		$(".js_all_play").click(function(){
			//获取全部列表歌曲的id
			var playSongId = $(".songId");
			for (var i = 0; i < playSongId.length; i++) {
				var songId = $(playSongId[i]).val();
				//判断是否被在播放列表
				$.ajax({
					async:true,
					url:"${pageContext.request.contextPath}/PlayListServlet",
					type:"post",
					data:{op:"existPlayList",songId:songId,accountId:accountId},
					dataType:"text",
					success:function(result,status,xhr){
						//未添加到播放列表
						if ("yesPlay"!=result) {
							$.ajax({
								async:true,
								url:"${pageContext.request.contextPath}/PlayListServlet",
								type:"post",
								data:{op:"addPlayList",songId:result,accountId:accountId},
								dataType:"text",
								success:function(result,status,xhr){
									
									},
									error:function(xhr,status,error){
										alert("ajax异步请求失败1");
									}
								});
							}else if ("yesPlay"==result) {
								
							}
						},
						error:function(xhr,status,error){
							alert("ajax异步请求失败2");
						}
					});
			}
			window.open("${pageContext.request.contextPath}/front/play.jsp");
		})
		
	</script>
</body>
</html>
